import {Component, ElementRef, Input, OnInit, TemplateRef, ViewChild} from '@angular/core';
import {DhlCommonComponent} from '../dhlCommonComponent';
import {FormUtil} from '../../../utils/form-util';
import {ObjectUtil} from '../../../utils/object-util';
import {NzModalRef, NzModalService} from "ng-zorro-antd/modal";

@Component({
  templateUrl: './dhl-window.component.html',
})
export class DhlWindowComponent extends DhlCommonComponent implements OnInit {


  loading = false;
  isVisible;
  buttonStyle;
  btnType;
  showCloseBtn = true;
  windowData = {}
  tplModal: NzModalRef;
  @Input() beforeCheck;
  @Input() buttons;
  @Input() submitUrl;
  @Input() contentComponent: TemplateRef<any>;
  @Input() okText = '确定';
  @Input() cancelText = '关闭';
  @Input() width = '800px';
  @Input() title = '标题';
  @Input() afterOk;

  @Input() set data(value) {
    this.windowData = {...value};

    if (value.buttonStyle) {
      this.buttonStyle = value.buttonStyle;
    }

    if (!ObjectUtil.isUndefined(value.showCloseBtn)) {
      this.showCloseBtn = value.showCloseBtn;
    }

  };


  @ViewChild('formModal', {static: true, read: ElementRef}) formModal: ElementRef;
  @ViewChild('footer', {static: true, read: TemplateRef}) footer: TemplateRef<any>;

  constructor(private modal: NzModalService) {
    super();
  }


  initButtons(): void {
    const startLoadingFun = this.startLoading;
    const endLoadingFun = this.endLoading;

    if (this.buttons) {
      for (let i = 0; i < this.buttons.length; i++) {
        const btn = this.buttons[i];

        btn.buttonClick = () => {

          if (btn.onClick) {
            const formData = FormUtil.getData($(this.tplModal.getElement()));
            btn.onClick({
              endLoading: () => {
                endLoadingFun(this.buttons[i]);
              },
              startLoading: () => {
                startLoadingFun(this.buttons[i]);
              },
              closeWindow: () => {
                this.closeFormWindow();
              },
              formData
            });
          }
        };
      }
    }
  }


  ngOnInit() {

    this.initButtons();

    this.tplModal = this.modal.create({
      nzTitle: this.title,
      nzClassName: 'dhl-window-style',
      nzStyle: {top: '30%'},
      nzContent: this.contentComponent,
      nzMaskClosable: false,
      nzFooter: this.footer,
      nzOkText: this.okText,
      nzCancelText: this.cancelText,
      nzWidth: this.width,
      nzMask: false,
      nzClosable: true,
      nzComponentParams: this.windowData,
      nzOnOk: this.handleOk,
    });
  }

  endLoading(btn) {
    btn.loading = false;
  }

  startLoading(btn) {
    btn.loading = true;
  }

  closeFormWindow() {
    this.tplModal.destroy();
  }


  handleCancel() {
    this.tplModal.destroy();
  }

  handleOk() {

    const data = FormUtil.getData($(this.tplModal.getElement()));

    if (this.beforeCheck) {
      const result = this.beforeCheck(data);
      if (result) {
        this.messageService.error(result);
      } else {
        this.triggerSubmit(data);
      }
    } else {
      this.triggerSubmit(data);
    }


  }

  getContentComponent() {
    return this.tplModal.getContentComponent();
  }

  triggerSubmit(data) {
    if (this.submitUrl) {
      this.loading = true;

      this.requestService.post(this.submitUrl, data).subscribe((obj) => {
        if (obj) {
          this.tplModal.destroy();
          if (this.afterOk) {
            this.afterOk({formData: obj});
          }
        } else {
          this.loading = false;
        }
      });
    } else {
      this.tplModal.destroy();
      if (this.afterOk) {
        this.afterOk({formData: data});
      }
    }
  }


}




